<template>
  <Field :label="props.label.value">
    <template #input>
      <div v-if="!show" class="choose-date">
        {{props.noticeText.value}}
      </div>
      <Calendar
        v-model="show"
        type="props.singleDate.value ? 'single' : 'multiple'"
        @confirm="onConfirm"
      />
    </template>
  </Field>
</template>

<script>
import { Calendar, Field } from "vant";

export default {
  components: { Calendar, Field },
  props: ["props"],
  data() {
    return {
      show: false,
    };
  },
  methods: {
    onConfirm() {
      this.show = false;
    },
  },
};
</script>

<style scoped>
.choose-date{
  width: 100%;
  color: #b8b6b6;
}
</style>